<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!-- 修改密码 -->
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit" />
<meta name="force-rendering" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="名榜,wangid">
<title>密码修改</title>

<!-- CSS -->
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/children.css">

<!-- 在线图标库 地址：http://fontawesome.dashgame.com/-->
<link
	href="http://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
	rel="stylesheet">

<!-- layui css -->
<link rel="stylesheet" href="layui/css/layui.css">
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<style type="text/css">
.right input:focus {
	border-style: solid;
	border-color: #03a9f4;
	box-shadow: 0 0 15px #03a9f4;
}
</style>

</head>

<body>
	<%
		if (request.getAttribute("value") != null) {

			String mess = (String) request.getAttribute("value");
	%>
	<script type="text/javascript">
	alert("<%=mess%>");
	</script>
	<%
		}
	%>
	<div class="bg_box"
		style="background: url(images/20180604.jpg) no-repeat center center; background-size: cover;"></div>
	<div class="container" style="background-color: transparent;">
		<div class="wangid_conbox" style="background-color: transparent;">
			<!-- 当前位置 -->
			<div class="zy_weizhi bord_b">
				<i class="fa fa-home fa-3x"></i> <a href="sta.do">首页</a> <a>我的信息</a>
				<span>修改密码</span>
			</div>

			<!-- 内容 -->
			<div class="wenxts_ke" style="background-color: transparent;">
				<p>
					<i>温馨提示：</i>修改密码后请牢记新密码，避免忘记密码影响工作进程
				</p>
			</div>
			<!-- 下面写内容 -->

			<div class="kehubh_tj_k">
				<form class="layui-form layui-form-pane" action="sta.do?op=updPwd"
					method="post" onsubmit="return al()">

					<ul>
						<li>
							<div class="left">工号</div>
							<div class="right">

								<input type="text" name="id" style="border-radius: 10px;"
									required lay-verify="required" readonly autocomplete="off"
									class="layui-input" value="${sessionScope.userMessage.userId}">

							</div>
						</li>
						<li>
							<div class="left">原密码：</div>
							<div class="right">

								<input type="password" name="password"
									style="border-radius: 10px;" required lay-verify="required"
									placeholder="请输入原密码" autocomplete="off" class="layui-input">

							</div>
						</li>
						<li>
							<div class="left">新密码：</div>

							<div class="right">

								<input type="password" id="p1" onblur="mm()" name="newpassword"
									style="border-radius: 10px;" required lay-verify="required"
									placeholder="请输入新密码" autocomplete="off" class="layui-input">

							</div>
							<div>
								<label class="control-label" for="inputSuccess" id="mm"></label>
							</div>
						</li>
						<li>
							<div class="left">确认新密码：</div>
							<div class="right">

								<input type="password" id="p2" onblur="mm2()"
									style="border-radius: 10px;" required lay-verify="required"
									placeholder="请输入新密码" autocomplete="off" class="layui-input">

							</div>
							<div>
								<label class="control-label" for="inputSuccess" id="mm2"></label>
							</div>
						</li>
						<li>
							<div class="left">&nbsp;</div>
							<div class="right">
								<button class="button_qr" id="xg" onclick="mm(),mm2()">确定修改</button>
							</div>
						</li>
					</ul>
				</form>
			</div>
		</div>
	</div>
	<script>
		var f1 = false;
		var f2 = false;
		function al() {
			if (f1 & f2) {
				return true;
			}

			return false;
		}
		function mm() {
			f1 = false
			var s = document.getElementById("p1").value;
			if (s.length == 0) {
				document.getElementById("mm").innerHTML = "<span style='color: red;'>密码不能为空</span>";
			} else if (s.length < 6) {
				document.getElementById("mm").innerHTML = "<span style='color: red;'>密码至少为六位</span>";
			} else {
				f1 = true;
				document.getElementById("mm").innerHTML = "<span style='color: darkcyan;'>格式正确</span>";
			}
		}
		function mm2() {
			f2 = false
			var s = document.getElementById("p1").value;
			var c = document.getElementById("p2").value;
			if (c.length == 0) {
				document.getElementById("mm2").innerHTML = "<span style='color: red;'>密码不能为空</span>";
			} else if (c.length < 6) {
				document.getElementById("mm2").innerHTML = "<span style='color: red;'>密码至少为六位</span>";
			} else if (s != c) {
				document.getElementById("mm").innerHTML = "<span style='color: red;'>两次密码输入不一致</span>";
				document.getElementById("mm2").innerHTML = "<span style='color: red;'>两次密码输入不一致</span>";
			} else {
				f2 = true;
				document.getElementById("mm2").innerHTML = "<span style='color: darkcyan;'>格式正确</span>";
			}
		}
	</script>

	<!-- layui js -->
	<script src="layui/layui.js"></script>
</body>
</html>
